<template>
    <div>
        <!-- 表格表头 -->
        <div class="table-header">
            <div>
                <el-button type="primary" icon="el-icon-circle-plus-outline" size="small" @click="addAdmin()"
                    v-if="isAuth()">添加集团管理员
                </el-button>
                <!-- <el-button type="primary" icon="el-icon-search" size="small">搜索</el-button> -->
                <!-- <el-button type="primary" icon="el-icon-search" size="small">搜索</el-button> -->
            </div>
            <div>
                <el-button size="small" round icon="el-icon-refresh" @click="getDataTable()" v-if="isAuth()">
                </el-button>
            </div>
        </div>

        <!-- 表格表体 -->
        <el-table :data="tabledata" @current-change="currentChange"  highlight-current-row>
            <el-table-column type="index" width="50" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="user.groupName" header-align="center" align="center" show-overflow-tooltip
                label="所属集团">
            </el-table-column>
            <el-table-column prop="user.username" header-align="center" align="center" show-overflow-tooltip
                label="员工姓名">
            </el-table-column>
            <el-table-column prop="user.phone" header-align="center" align="center" show-overflow-tooltip label="手机号">
            </el-table-column>
            <el-table-column prop="user.email" header-align="center" align="center" show-overflow-tooltip label="邮箱">
            </el-table-column>
            <el-table-column prop="user.avatar" header-align="center" align="center" show-overflow-tooltip label="头像">
                <template slot-scope="scope">
                    <img :src="scope.row.user.avatar" min-width="40" height="40" />
                </template>
            </el-table-column>
            <el-table-column prop="createdTime" header-align="center" align="center" show-overflow-tooltip label="角色">
            </el-table-column>
            <el-table-column prop="createdTime" header-align="center" align="center" show-overflow-tooltip label="创建时间">
            </el-table-column>
            <el-table-column fixed="right" header-align="center" align="center" width="220" label="操作">
                <template slot-scope="scope">
                    <el-button type="text" size="small" @click="createAccount(scope.row.user.userId)" class="el-icon-setting"
                        v-if="isAuth()">分配账号
                    </el-button>
                    <el-button type="text" size="small" @click="resetPassword(scope.row.user.userId)" class="el-icon-setting"
                        v-if="isAuth()">设置密码
                    </el-button>
                </template>
            </el-table-column>

        </el-table>

        <div style="clear:both;height:30px;margin-top:10px;">
            <!-- 表格表尾 -->
            <ec-pagination :page="page" @size-change="handleSizeChange" @current-change="handleCurrentChange">
            </ec-pagination>
        </div>
        <!-- 创建集团管理员 -->
        <add-admin v-if="addAdminVisible" ref="addAdmin" @refreshDataList="getDataTable"></add-admin>
    </div>
</template>
<script>
    import * as admingroupService from '@/api/upms/admingroup'
    import * as userService from '@/api/upms/user'
    import * as userAccountService from '@/api/upms/useraccount'
    import AddAdmin from './add-admin'
    
    export default {
        props:{
            pkGroup: {
                type: String,
                required: true,
                default: ''
            }
        },
        data() {
            return {
                searchForm: {
                    username: '',
                    pkGroup: this.pkGroup,
                    pkOrg: ''
                },
                page: {
                    page: 1,
                    limit: 10,
                    total: 0
                },
                showHeader: true,
                addAdminVisible: false,
                tabledata: [],
            }
        },
        created() {
            this.getDataTable()
        },
        components: {
            AddAdmin
        },
        methods: {
            // 获取数据列表
            getDataTable() {
                this.loading = true
                let query = {
                    page: this.page.page,
                    limit: this.page.limit,
                    // username: this.searchForm.username,
                    pkGroup: this.searchForm.pkGroup,
                    // userType: 'group'
                };
                admingroupService.getadmingroupuserpage(query).then(data => {
                    this.tabledata = data.list;
                    this.page.total = data.totalCount;
                    this.loading = false;
                }).catch((res) => {
                    this.loading = false;
                });
            },
            //切换页数
            handleSizeChange(val) {
                this.page.limit = val;
                this.getDataTable();
            },
            // 翻页
            handleCurrentChange(val) {
                this.page.page = val;
                this.getDataTable();
            },
            // 切换显示搜索表头
            changeHeader() {
                this.showHeader = !this.showHeader
            },
            // 重置搜索表单
            handleFormReset() {
                this.$refs.searchForm.resetFields()
            },
            currentChange(row) {
                if (row) {
                    this.$emit("setUser",row.user.userId)
                    // this.getRelationOrggroupData()
                }
            },
            addAdmin(id) {
                this.addAdminVisible = true
                this.$nextTick(() => {
                    this.$refs.addAdmin.init(id, this.searchForm.pkGroup)
                })
            },
            createAccount(userId) {
                if (userId) {
                    this.$confirm("确认分配账号？", "确认信息", {
                        distinguishCancelAndClose: true,
                        confirmButtonText: "确定",
                        cancelButtonText: "取消"
                    }).then(() => {
                        userAccountService.createAccount({
                            userId: userId
                        }).then(data => {
                            this.$message({
                                message: data,
                                type: 'success'
                            });
                        })
                    });
                }
            },
            resetPassword(userId) {
                if (userId) {
                    this.$confirm("确认重置密码？", "确认信息", {
                        distinguishCancelAndClose: true,
                        confirmButtonText: "确定",
                        cancelButtonText: "取消"
                    }).then(() => {
                        userService.resetPassword(userId).then(data => {
                            if (data.code == 200) {
                                this.$message({
                                    message: data.msg,
                                    type: 'success'
                                });
                            } else {
                                this.$message({
                                    message: data.msg,
                                    type: 'warning'
                                });
                            }

                        })
                    });
                }
            },
        }
    }
</script>
<style scoped>

</style>